<template>
   <div>
     <h1>宠物认领中心填写表</h1>
     姓名:
     <input type="text" placeholder="请输入姓名" v-model="form.name">
     <br>
     性别:
     <input type="radio" name="sex" value="male" v-model="form.sex">男
     <input type="radio" name="sex" value="female" v-model="form.sex">女
     <br>
    年龄:
    <input type="text" name="age" placeholder="请输入年龄" v-model="form.age"> 
  
    <br>
    所在城市:
    <select name="city" v-model="form.city">
     <option value="suzhou">苏州</option>
     <option value="shanghai">上海</option>
     <option value="anhui">安徽</option>
     <option value="zhejiang">浙江</option>
    </select>
    <br>
    宠物:
    <input type="checkbox" value="cat" v-model="form.pets">猫
    <input type="checkbox" value="dog" v-model="form.pets">狗
    <input type="checkbox" value="fish" v-model="form.pets">鱼
    <br>
    个人介绍:                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               
    <textarea v-model="form.desc"></textarea>             
    <br>
    <button @click="toSubmit">免费注册</button>
    <button @click="toRest">重置</button>
   </div>
 </template>
 
 <script>
 export default {
   data(){
     return{
      form:{
       name: '',
       sex: '',
       age: '',
       city: '',
       pets: [],
       desc: ''
       }
       
     }
   },
   methods:{
     toSubmit(){
       console.log(this.form)
     },
     toRest(){
       this.form={
         name: '',
         sex: '',
         age: '',
         city: '',
         pets: [],
         desc: ''
       }
     }
   }
 }
 </script>
 
 <style>
 
 </style>